Introduction

From the WMC side, we have to develop a sample LG application through which we would like to verify the following…

Supported device models and configuration
DRM Profiles for real devices
Error log with details
Different types of assets
Interaction with Magic Remove and PBR’s

This is the landing page of the LG Retail Client.

Sample App LG (Screenshot)

Once user click on any box, the player screen will appear along with player metrics.

Sample App LG (Screenshot)

Prerequisite :

Azuki configuration for Device Profile (Chrome_Linux)
Clear and Encrypted streams with DASH+WV and HLS+WV

Supported DRM Profiles

Lg WebEngine

Mediakind LG WebOs

This repository contains a sample app that used the Bitmovin HTML5 Player (version 8) on LG webOS

Using the Sample App with webOS IDE

Download WebOS IDE
Open the sample app with webOS IDE
Connect your TV Device. This tutorial is a good reference
Run/debug the sample app. If you debug, you will see Chrome developer tools launch. This will enable you to debug, monitor network requests, and execute commands through the javascript console.

Using the Sample App with webOS CLI

Install dependencies with npm install
Activate developer mode on your TV device and use passphrase to run npm run connect <ip|host> <passphrase>
Input your player key into src/main.js
Build the ipk package running npm run build
Install the app to your device DEVICE=<ip|host> npm run push
You can debug the app with remote debugger with DEVICE=<ip|host> npm run debug

note: If you are having problem with permissions for ares CLI try chmod +x node_modules/ares-webos-sdk/bin/*
tip: If continuous running of DEVICE=<ip|host> npm run debug does not work you first need to kill the app by running DEVICE=<ip|host> npm run stop and then run debug again.

Notes for developing your own app

Make sure to enable file_protocol and set your app_id in the tweaks section of your config

Sample script for Locally hosted application

{
    "devtest_vod": {
        playMode: "VOD",
        serverUrl: "https://ottapp-appgw-amp-a.dev.mr.tv3cloud.com",
        ownerUid: "azuki",
        primaryId: "koushik.a.dutta@mediakind.com",
        mediaId: "Default_2007_Jitp_Reach_HD",
        authToken: "",
    },
    "devtest_live": {
        playMode: "LIVE",
        serverUrl: "https://ottapp-appgw-amp-a.dev.mr.tv3cloud.com",
        ownerUid: "azuki",
        primaryId: "koushik.a.dutta@mediakind.com",
        mediaId: "LIVE$4346",
        appId: "3493840",
        authToken: "",
    }
}

Sample script for remotely hosted application

<html>
    <head>
        <meta http-equiv="refresh" content="0;url=http://www.example.com/index.html">
    </head>
</html>

Sample script for Remote control


document.addEventListener("keydown", function (evt) {
    var keycode;
    if (window.event) {
        keycode = evt.keyCode;
    } else if (e.which) {
        keycode = evt.which;
    }
    switch (keycode) {
        case 0x25: console.log("Left", keycode); break;
        case 0x26: console.log("Up", keycode); break;
        case 0x27: console.log("Right", keycode); break;
        case 0x28: console.log("Down", keycode); break;
    }
});

Additional Documentation (WMC-SDK)

Complete API documentation is available at https://wmc.mr.tv3cloud.com/nba/docs/index.html

Additional Documentation (LgWebOs)

WebEngine : https://webostv.developer.lge.com/discover/specifications/web-engine/
Supported Media and DRM Formats : https://webostv.developer.lge.com/discover/specifications/supported-media-formats/
Debugging Web App : https://webostv.developer.lge.com/sdk/command-line-interface/debugging-web-applications-cli/
Access Remote Control : https://webostv.developer.lge.com/develop/code-samples/remote-control/

Tutorial: Retail Client LG

Retail Client LG